<template>
    <div id="blobshow">
        <div class="left" v-bind:style="{backgroundImage:'url('+leftimg+')'}"></div>
        <div class="right">
            <div class="text">
                <h2>小窝 / Blob</h2>
                <i>前方施工请绕行</i>
                <div class="item"></div>
            </div>
        </div>
    </div>
</template>
<script>
import tianyi from "../assets/tianyi.jpeg";

export default {
  data() {
    return {
      leftimg: tianyi
    };
  }
};
</script>
<style lang="scss" scoped>
#blobshow {
  padding-top: 10vh;
  padding-left: 5%;
  padding-right: 5%;
  width: 90%;
  height: 90vh;
  .left {
    float: left;
    width: 50%;
    height: 100%;
    background-size: 100% auto;
    background-position: center -30px;
    @media (max-width: 640px) {
      display: none;
    }
  }
  .right {
    float: left;
    background-color: #ffffff;
    width: 50%;
    @media (max-width: 640px) {
      width: 100%;
    }
    height: 100%;
    .text {
      padding: 5vh 10%;
    }
  }
}
</style>
